import Taro, { ENV_TYPE } from '@tarojs/taro'
import classnames from 'classnames'
import { View, Image } from '@tarojs/components'
import { PropsType } from './PropsType'

const isALIPAY = Taro.getEnv() === ENV_TYPE.ALIPAY

export default class Empty extends Taro.Component<PropsType, any> {
  static options = { addGlobalClass: true }
  static defaultProps = {
    prefixCls: 'at-empty',
    image: isALIPAY
      ? 'https://public-web-resources.51yzone.com/images/empty-alipay-ui.png'
      : 'https://public-web-resources.51yzone.com/images/empty.png',
    imageStyle: {},
    description: '暂无数据',
    title: '',
    size: 'normal',
    visible: true
  }

  render() {
    const {
      className,
      prefixCls,
      imageStyle,
      image = '',
      description,
      children,
      size,
      title,
      visible
    } = this.props
    const cls = classnames(prefixCls, className, {
      [`${prefixCls}-${size}`]: true,
      [`${prefixCls}-local`]: !title
    })
    return visible ? (
      <View className={cls}>
        <View className={`${prefixCls}-image`} >
          <Image src={image} style={imageStyle} />
        </View>
        {title && <View className={`${prefixCls}-title`}>{title}</View>}
        {description && <View className={`${prefixCls}-description`}>{description}</View>}
        <View className={`${prefixCls}-footer`}>{children}</View>
      </View>
    ) : (
      ''
    )
  }
}
